@import "partials/mixins";
#flowBase {
    line-height: pxToRem(72px);
    height: pxToRem(72px);
    background-color: #252832;
    padding: pxToRem(10px) 0;
    .content {
        .name {
            margin: 0 pxToRem(15px);
            font-size: pxToRem(32px);
        }
        width: 100%;
        padding-right: pxToRem(15px);
        border-left: pxToRem(10px) solid #2AC5C7;
        .icon {
            width: pxToRem(36px);
            height: pxToRem(36px);
            display: inline-block;
            margin-right: pxToRem(15px);
            &.icon-weather-1 {
                background: url("~img/icon-weather-1.png") no-repeat center center;
                background-size: 100% 100%;
            }
            &.icon-weather-2 {
                background: url("~img/icon-weather-2.png") no-repeat center center;
                background-size: 100% 100%;
            }
            &.icon-weather-3 {
                background: url("~img/icon-weather-3.png") no-repeat center center;
                background-size: 100% 100%;
            }
        }
        .temperature {
            font-weight: normal;
            color: #26c3c8;
        }
        .datetime {
            font-size: pxToRem(24px);
            font-weight: normal;
            text-align: right;
        }
    }
}